<template>
  <!-- 系统角色管理 -->
  <div class="systemRoleManage-container">
    <BaseBreadcrumb>
      <searchData
        :search-data="searchOptions"
        @search="handleSearch"
      />
      <a-card>
        <!-- <title-name title="角色列表" /> -->
        <div class="table-operateors mb20">
          <a-button
            v-btnPermission="'sy_007_add_01'"
            type="primary"
            @click="handleUpdate('add')"
          >
            新增
          </a-button>
        </div>
        <div
          class="pub-table-select-count"
          style="margin: 10px 0"
        >
          <a-icon
            type="info-circle"
            theme="twoTone"
          />
          <span>
            共计：
            <a>{{ statisticsInfo.totalNum || 0 }} 个</a>
            <!-- <a>{{ statisticsInfo.totalNum || 0 }} 个</a> -->
          </span>
        </div>
        <list-table
          ref="table"
          :columns="columns"
          :request="loadData"
          row-key="id"
        >
          <template
            slot="index"
            slot-scope="text, record, index"
          >
            <span>{{ index + 1 }}</span>
          </template>
          <template
            slot="enable"
            slot-scope="text"
          >
            {{ text ? '可用' : '不可用' }}
          </template>
          <template
            slot="action"
            slot-scope="text, record"
          >
            <MoreButton>
              <a
                v-btnPermission="'sy_007_loo_02'"
                class="base-btn"
                @click="handleUpdate('look', record)"
              >查看</a>
              <a
                v-btnPermission="'sy_007_edi_03'"
                class="base-btn"
                @click="handleUpdate('edit', record)"
              >编辑</a>
              <a
                v-btnPermission="'sy_007_inc_04'"
                class="base-btn"
                @click="handleUpdate('addSource', record)"
              >添加资源</a>
              <a
                v-btnPermission="'sy_007_inc_04'"
                class="base-btn"
                @click="handlepost(record)"
              >绑定岗位</a>
              <a
                v-btnPermission="'sy_007_del_05'"
                class="base-btn"
                @click="handleUpdate('delete', record)"
              >删除</a>
            </MoreButton>
          </template>
        </list-table>
      </a-card>
      <AddResource
        :id="childInitData.id"
        ref="addResourceRefs"
      />
    </BaseBreadcrumb>
    <Post
      ref="post"
      :id="id"
      :select-post="selectPost"
      @updateList="updateList"
    />
  </div>
</template>

<script>
import { packageConfirm } from '@/utils/baseAction.js'
import { getRoleManageListNew, deleteRoleList } from '@/api/system/system.js'
import AddResource from './AddResource.vue'
import Post from "./post/index"
import MoreButton from '@/components/MoreButton'
const searchOptions = [
  {
    name: '名称',
    value: 'nameLike',
    type: 'input',
  },
  {
    name: '编码',
    value: 'codeLike',
    type: 'input',
  },
]

const columns = [
  {
    title: '序号',
    dataIndex: 'index',
    width: '65px',
    scopedSlots: { customRender: 'index' },
  },
  {
    title: '名称',
    dataIndex: 'name',
  },
  {
    title: '编码',
    dataIndex: 'code',
  },
  {
    title: '业务标识',
    width: '100px',
    dataIndex: 'commandName',
  },
  {
    title: '绑定岗位',
    dataIndex: 'postAllName',
  },
  {
    title: '状态',
    dataIndex: 'enable',
    width: '100px',
    scopedSlots: { customRender: 'enable' },
  },
  {
    title: '操作',
    width: '240px',
    scopedSlots: { customRender: 'action' },
  },
]
export default {
  name:'a'+Date.now(),
  components: {
    MoreButton,
    AddResource,
    Post
  },
  data() {
    return {
      selectPost: [],
      childInitData: {},
      visible: {
        addResource: false,
      },
      searchOptions,
      columns,
      queryParam: {},
      statisticsInfo: {
        totalNum: 0,
      },
      id: ''
    }
  },
  methods: {
    updateList() {
      this.$refs.table.refresh(true)
    },
    handlepost(row) {
      const postList = []
      row.postList && row.postList.forEach(item => {
        const obj = {
          id: item.postId,
          code: item.postCode,
          pname: item.postName
        }
        postList.push(obj)
      })
      this.id = row.id
      this.selectPost = postList
      console.log(this.selectPost)
      this.$refs.post.open()
    },
    handleAddSourceConfirm() {
      this.handleCancel()
      this.handleSearch()
    },
    handleCancel() {
      this.visible.addResource = false
    },
    async loadData(parameter) {
      // try {
        const requestParameters = Object.assign({}, { ...parameter, pageIndex: parameter.pageNo }, this.queryParam)
        return getRoleManageListNew(requestParameters).then(res => {
          res.code = res.status;
          res.totalSize = res.data.total;
          this.statisticsInfo.totalNum = res.data.total;
          const arr = []
          res.data.list.forEach(item=>{
            const obj = {...item,...item.role}
            arr.push(obj)
          })
          res.data = arr;
          return res;
        })
    },
    handleSearch(val) {
      this.queryParam = {
        ...this.queryParam,
        ...val,
      }
      this.$refs.table.refresh(true)
    },
    handleUpdate(type, data = {}) {
      this.childInitData = { ...data }
      const commonHandler = () => {
        this.$router.push({
          path: '/systemManage/menuPermissions/systemRoleManage/updateRole',
          query: {
            pageType: type,
            id: data.id || '',
          },
        })
      }
      const map = {
        add: commonHandler,
        edit: commonHandler,
        look: commonHandler,
        delete: () => {
          this.deleteRoleListReq(data)
        },
        addSource: () => {
          this.$refs.addResourceRefs.open()
        },
      }
      map[type] && map[type]()
    },
    async deleteRoleListReq(data) {
      packageConfirm({
        callback: async () => {
          const res = await deleteRoleList(data)
          this.$message.success(res.message || res.data.message)
          this.handleSearch()
        }
      })
    },
  },
}
</script>

<style>
</style>
